<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增标准主')"/>
    <th:block th:include="include :: bootstrap-fileinput-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-ncStandard-add">
        <!--作物品种ID-->
        <input id="treeId" name="cropVarieties" type="hidden" value="100"/>
        <!--育苗标准-->
        <input id="standardType" name="standardType" type="hidden" th:value="${standardType}">
        <!--作物类别-->
        <input id="cropTypeCn" name="cropTypeCn" type="hidden">
        <!--作物名称-->
        <input id="cropNameCn" name="cropNameCn" type="hidden">

        <input id="pic" name="pic" type="hidden">


        <div class="form-group">
            <label class="col-sm-3 control-label">图片：</label>
            <div class="col-sm-8">
                <div class="file-loading col-sm-8">
                    <input id="pic-upload" name="file" multiple type="file">
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">作物品种：</label>
            <div class="col-sm-8">
                <div class="input-group">
                    <input class="form-control" name="cropVarietiesCn" type="text" required onclick="selectCaiTree()"
                           id="treeName" readonly="true">
                    <span class="input-group-addon"><i class="fa fa-search"></i></span>
                </div>
            </div>

        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">适宜季节：</label>
            <div class="col-sm-8">
                <select name="season" class="form-control m-b" th:with="type=${@dict.getType('nc_season')}">
                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                </select>
            </div>
        </div>

        <!--<div class="form-group">
            <label class="col-sm-3 control-label">制作人：</label>
            <div class="col-sm-8">
                <input id="createBy" name="createBy" class="form-control" type="text">
            </div>
        </div>-->
        <div class="form-group">
            <label class="col-sm-3 control-label">备注：</label>
            <div class="col-sm-8">
                <textarea id="remark" rows="3" name="remark" class="form-control" type="text"></textarea>
            </div>
        </div>

        <!--<div class="form-group">
            <label class="col-sm-3 control-label">编码：</label>
            <div class="col-sm-8">
                <input id="code" name="code" class="form-control" type="text">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">父编码：</label>
            <div class="col-sm-8">
                <input id="parentCode" name="parentCode" class="form-control" type="text">
            </div>
        </div>-->
    </form>
</div>
<div th:include="include::footer"></div>
<th:block th:include="include :: bootstrap-fileinput-js"/>
<script type="text/javascript">
    var prefix = ctx + "system/ncStandard"
    var cai_prefix = ctx + "system/cai";
    $("#form-ncStandard-add").validate({
        rules: {
            xxxx: {
                required: true,
            },
        },
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/add", $('#form-ncStandard-add').serialize());
        }
    }

    /*蔬菜管理-新增-选择父蔬菜树*/
    function selectCaiTree() {
        var options = {
            title: '蔬菜选择',
            width: "380",
            url: cai_prefix + "/selectCaiTree/" + $("#treeId").val()+'?parentIds=210,',
            callBack: doSubmit
        };
        $.modal.openOptions(options);
    }

    function doSubmit(index, layero) {
        var tree = layero.find("iframe")[0].contentWindow.$._tree;
        if ($.tree.notAllowParents(tree)) {
        var body = layer.getChildFrame('body', index);
        $("#treeId").val(body.find('#treeId').val());
        $("#treeName").val(body.find('#treeName').val());
        layer.close(index);
        }
    }

    /*文件上传*/
    $("#pic-upload").fileinput({
        'theme': 'explorer-fas',
        overwriteInitial: true,
        initialPreviewAsData: true,
        language: 'zh', //设置语言
        uploadUrl: ctx + "common/upload", //上传的地址
        allowedFileExtensions: ['jpg', 'gif', 'png', 'JPG', 'jpeg'],//接收的文件后缀
        //uploadExtraData:{"id": 1, "fileName":'123.mp3'},
        uploadAsync: true, //默认异步上传
        showUpload: true, //是否显示上传按钮
        showRemove: true, //显示移除按钮
        showPreview: true, //是否显示预览
        showCaption: true,//是否显示标题
        browseClass: "btn btn-primary", //按钮样式
        //dropZoneEnabled: true,//是否显示拖拽区域
        //minImageWidth: 50, //图片的最小宽度
        //minImageHeight: 50,//图片的最小高度
        //maxImageWidth: 1000,//图片的最大宽度
        //maxImageHeight: 1000,//图片的最大高度
        //maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
        //minFileCount: 0,
        //maxFileCount: 10, //表示允许同时上传的最大文件个数
        enctype: 'multipart/form-data',
        validateInitialCount: true,
        previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
        msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
        initialPreview: [
            // "/img/profile.jpg"
        ]

    }).on('filepreupload', function (event, data, previewId, index) {     //上传中
        console.log('文件正在上传');
    }).on("fileuploaded", function (event, data, previewId, index) {    //一个文件上传成功
        console.log(data)
        $('#pic').val(data.response.fileName);
    }).on('fileerror', function (event, data, msg) {  //一个文件上传失败
        layer.alert("<font color='red'>上传失败！</font>", {
            icon: 0,
            title: "系统提示"
        });
    });

</script>
</body>
</html>
